import React from 'react';
import { Row, Col } from 'antd';
import { Input } from 'antd';
import { DatePicker, Space, Modal } from 'antd';
import { Select } from 'antd';
import { Button, Menu, Dropdown, Form, Radio } from 'antd';
const { RangePicker } = DatePicker;
import { Table } from 'antd';
const { Option } = Select;
import { history } from 'umi';
import { DownOutlined, UpOutlined } from '@ant-design/icons';

import { FormInstance } from 'antd/lib/form';
import { Transfer } from 'antd';
import request from '../../../http';

//教师信息维护
const xinzheng = () => {
  const onSubmit = (value: any) => {
    //获取老师姓名
    console.log(value);
    //发送网络请求
  };

  const formItemLayout = {
    labelCol: {
      // xs: { span: 24 },
      // sm: { span: 8 },
    },
    wrapperCol: {
      xs: { span: 24 },
      sm: { span: 16 },
    },
  };

  const [form] = Form.useForm();
  const onGenderChange = (value: string) => {
    switch (value) {
      case 'male':
        form.setFieldsValue({ note: 'Hi, man!' });
        return;
      case 'female':
        form.setFieldsValue({ note: 'Hi, lady!' });
        return;
      case 'other':
        form.setFieldsValue({ note: 'Hi there!' });
    }
  };

  return (
    <div>
      <Form onFinish={onSubmit} {...formItemLayout}>
        <div>
          <div style={{ marginLeft: '0px', float: 'left', width: '300px' }}>
            <Form.Item name="note" label="院系：">
              <Select placeholder="请选择" onChange={onGenderChange} allowClear>
                <Option value="male">male</Option>
                <Option value="female">female</Option>
                <Option value="other">other</Option>
              </Select>
            </Form.Item>
          </div>

          <div style={{ marginLeft: '0px', float: 'left', width: '300px' }}>
            <Form.Item name="note" label="专业：">
              <Select placeholder="请选择" onChange={onGenderChange} allowClear>
                <Option value="male">male</Option>
                <Option value="female">female</Option>
                <Option value="other">other</Option>
              </Select>
            </Form.Item>
          </div>

          <div style={{ marginLeft: '0px', float: 'left', width: '300px' }}>
            <Form.Item name="note" label="年级：">
              <Select placeholder="请选择" onChange={onGenderChange} allowClear>
                <Option value="male">male</Option>
                <Option value="female">female</Option>
                <Option value="other">other</Option>
              </Select>
            </Form.Item>
          </div>

          <div style={{ marginLeft: '0px', float: 'left', width: '300px' }}>
            <Form.Item name="note" label="班级：">
              <Select placeholder="请选择" onChange={onGenderChange} allowClear>
                <Option value="male">male</Option>
                <Option value="female">female</Option>
                <Option value="other">other</Option>
              </Select>
            </Form.Item>
          </div>

          <div style={{ marginLeft: '0px', float: 'left', width: '300px' }}>
            <Form.Item name="note" label="班主任：">
              <Select placeholder="请选择" onChange={onGenderChange} allowClear>
                <Option value="male">male</Option>
                <Option value="female">female</Option>
                <Option value="other">other</Option>
              </Select>
            </Form.Item>
          </div>

          <div style={{ marginLeft: '0px', float: 'left', width: '300px' }}>
            <Form.Item name="note" label="是否已结业：">
              <Select placeholder="请选择" onChange={onGenderChange} allowClear>
                <Option value="male">male</Option>
                <Option value="female">female</Option>
                <Option value="other">other</Option>
              </Select>
            </Form.Item>
          </div>

          <div style={{ clear: 'left', width: '1000px' }}></div>
        </div>
      </Form>
    </div>
  );
};

export default xinzheng;
